<template>
  <el-drawer
    title="编辑题目"
    v-model="drawer"
    :direction="direction"
    :before-close="handleClose" destroy-on-close :close-on-click-modal="true" :modal="true" size="25%" :lock-scroll="false">
    
    <choose-edit v-if="question.type == 'radio' || question.type == 'checkbox'"
      :title="question.title"
      :checked="question.isNecessary"
      :isRandom="question.isRandom"
      :options="question.options"
      @changeTitle="changeTitle"
      @changeNess="changeNess"
      @changeRandom="changeRandom"
      @finish="finish"
      @addOption="addOption"
      @deleteOption="deleteOption"
      @changeDefault="changeDefault"
      @changeText="changeText"
      @changeDes="changeDes"
      @upmove="upmove"
      @downmove="downmove"
      @addFinalOption="addFinalOption"
    >
    </choose-edit>
    <completion-edit v-if="question.type == 'completion'"
      :title="question.title"
      :checked="question.isNecessary"
      @changeTitle="changeTitle"
      @changeNess="changeNess"
      @finish="finish"  
    >
    </completion-edit>
    
    <!-- <score-edit v-if="question.type == 'score'"
      :title="question.title"
      :checked="question.isNecessary"
      :options="question.options"
      @changeTitle="changeTitle"
      @changeNess="changeNess"
      @finish="finish"
      @addOption="addOption"
      @deleteOption="deleteOption"
      @changeText="changeText"
      @changeGrade="changeGrade"
      @upmove="upmove"
      @downmove="downmove"
      @addFinalOption="addFinalOption"
      @autoFill="autoFill"
    >
    </score-edit> -->
     <star-edit v-if="question.type == 'score'"
      :title="question.title"
      :checked="question.isNecessary"
      :max="getmax(question)"
      @changeTitle="changeTitle"
      @changeNess="changeNess"
      @finish="finish"
      @changeGrade="changeGrade"
    >
    </star-edit>
  </el-drawer>
</template>

<script>
import ChooseEdit from './question/ChooseEdit.vue';
import CompletionEdit from './question/completion/CompletionEdit.vue'
import StarEdit from './question/score/StarEdit.vue'

export default {
  data() {
    return {
      direction: 'rtl',
    };
  },
  components: {
    ChooseEdit,
    CompletionEdit,
    StarEdit,
  },
  emits: ['changeRandom','changeTitle', 'changeNess', 'finish', 'addOption', 'deleteOption', 'changeDefault', 'changeText', 'changeDes', 'upmove', 'downmove', 'addFinalOption', 'autoFill', 'changeGrade'],
  methods: {
    handleClose(done) {
      // this.$confirm('确认关闭？')
      //   .then(_ => {
      //     done();
      //   })
      //   .catch(_ => {});
      done()
      this.finish()
    },

    changeTitle(title) {
      this.$emit('changeTitle', title)
    },

    changeNess(checked) {
      this.$emit('changeNess', checked)
    },

    changeRandom(isRandom) {
      this.$emit('changeRandom', isRandom)
    },

    finish() {
      this.$emit('finish')
    },

    getmax(question) {
      return question.options.length - 1
    },

    changeGrade(max) {
      this.$emit('changeGrade',max)
    },

    addOption(index) { 
      this.$emit('addOption',index)
    },

    addFinalOption() {
      this.$emit('addFinalOption')
    },

    deleteOption(index) {
      
      this.$emit('deleteOption', index)
    },

    changeDefault(index) {
      this.$emit('changeDefault', index)
    },

    changeText(data) {
      this.$emit('changeText', data)
    },

    changeDes(data) {
      this.$emit('changeDes', data)
    },
    
    upmove(index) {
      this.$emit('upmove', index)
    },

    downmove(index) {
      this.$emit('downmove', index)
    },
 
  },
  props: {
    question: {
      type: Object,
      default: {}
    },
    drawer: {
      type: Boolean,
      default: true,
    }
  }
};
</script>

<style>

</style>
